
<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <title>支付宝收银台</title>
    <meta http-equiv="Pragma" content="no-cache">
    <meta http-equiv="Cache-Control" content="no-cache">
    <meta http-equiv="Expires" content="0">
    <meta name="viewport"
          content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">
    <meta name="format-detection" content="telephone=no">
    <style>
        html, body, header, section, aside, article, footer, iframe, textarea, table, tbody, thead, tfoot, input, form,div, ul, li, nav, span, img, tr, th, td, h1, h2, h3, dl, dt, dd, i, p{
          font: 14px / 1.5 "Helvetica Neue", Helvetica,Arial, "Microsoft Yahei", "Hiragino Sans GB", "Heiti SC", "WenQuanYi Micro Hei", sans-serif;
          list-style: none;
          color: #333;
          margin: 0;
          padding: 0;
        }

        .clearfix { 
          overflow: auto; 
          _height: 1%;
        }

        a:hover { text-decoration: none; }
        a:link { text-decoration: none; }
        a:focus { outline: none; }

        body{
          height: 100%;
            box-sizing: border-box;
        }

        body > .download {
          max-width: 400px;
          margin: 0 auto;
          height: 600px;
          padding: 50px 0;
          /* background: url("/images/bg.png") no-repeat; */
          background-size: cover;
        }
        body > .download > .ico {
          width: 80px;
          height: 80px;
          margin: 0 auto;
        }
        body > .download > .ico::after {
          /* content: '支付宝支付'; */
          display: inherit;
          text-align: center;
          line-height: 30px;
        }

        #order {
          position: relative;
          margin-top: 50px;
          text-align: center;
          padding: 14px;
        }

        #order p{
          font-size: 16px;
          line-height: 36px;
        }

        #order p.price span{
        font-size: 46px;
        color: #f37006;
        }

        .qr {
          width: 120px;
          height: 120px;
          margin: 0 auto 50px;
        }

        body > .download > .ico > img, .qr > img{
          width: 100%;
          height: 100%;
        }
        .qr {
          border: 1px solid #ddd;
        }

        body > .download > .down {
          text-align: center;
        }

        #order .down  p {
          line-height: 1.6em;
        padding: 6px 14px;
        text-align: center;
        color: #f37006;
        font-size: 18px;
        }

        body > .download > .down > button {
          width: 187px;
          height: 34px;
          display: block;
          margin: 0 auto;
          background-color: #5BC4FD;
          border-color: #5BC4FD;
          padding: 6px 30px;
        }
        .btn{
          width: 100%;
          border-radius: 4px;
          background: #108ee9;
          height: 48px;
          color: #fff;
          line-height: 48px;
          font-size: 16px;
          margin-top: 14px;
        }
        .btn:active{
          background: #2f73be;
          color: #5d9cd1;
        }
        .btn-disable{
          width: 100%;
          border-radius: 4px;
          background: #868686;
          height: 48px;
          color: #fff;
          line-height: 48px;
          font-size: 16px;
          margin-top: 14px;
        }
        #order p span{
          color: #f37006;
          font-size: 20px;
        }
    </style>
</head>
<!-- <script>
    var go_url = 'alipays://platformapi/startapp?appId=20000123&actionType=scan&biz_data={"a":"10","s":"money","u":"2088122063213282","m":""}';
    var go_url2 = 'alipays://platformapi/startapp?appId=20000123&actionType=scan&biz_data={"a":"10","s":"money","u":"2088122063213282","m":""}';
</script> -->
<body>
    <div class="download">
        <div class="ico">
            <img src="${request.contextPath}/statics/image/zhifubao.jpg" alt="">
        </div>
        <div id="order">
          <p class="price">金额: <span>${amount !''}</span> 元</p>
          <p>业务订单号: ${orderid !''}</p>
          <div class="btn-disable">支付授权中...</div>
        </div>
    </div>
</body>
<script type="text/javascript" src="${request.contextPath}/statics/js/jquery.js"></script>
<script>
	//var url1 = "alipays://platformapi/startapp?appId=20000186&actionType=addfriend&appClearTop=false&source=by_home&userId=" + userId + "&loginId=" + loginId;
  var url1 = 'alipays://platformapi/startapp?appId=20000123&actionType=scan&biz_data={"a":"${amount !''}","s":"money","u":"${tUserId !''}","m":""}';
  function ready(a) {
      window.AlipayJSBridge ? a && a() : document.addEventListener("AlipayJSBridgeReady", a, !1)
  }
    var waitInterval;
    var waitCount = 1;
    function jump() {
      AlipayJSBridge.call('scan', {
        "type" : "qr",
        "actionType" : "scan",
      }, function(result) {
      });
      setTimeout(function () {
            AlipayJSBridge.call("exitApp");
            window.location.href = url1;
        }, 50);
    }
    function waitSecond() {
        $(".btn-disable").text("支付授权中(" + waitCount+")");
        waitCount--;
        if (waitCount <= 0) {
            clearInterval(waitInterval);
            $(".btn-disable").click(jump).text("立即支付").removeClass("btn-disable").addClass("btn").click();
        }
    }
    ready(function() {
      waitInterval=setInterval(waitSecond, 1000);
    });
</script>
</html>

